<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%  
String path = request.getContextPath();  
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";  
%>  
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>   
<%
		pageContext.setAttribute("APP_PATH", request.getContextPath());
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>添加展示类型</title>
<c:set value="${pageContext.request.contextPath}" var="path" scope="page"/>
<link href="${path}/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="${path}/js/jquery-3.2.1.min.js"></script> 
<script src="${path}/js/bootstrap.min.js"></script> 
<style >
    #pop{width:350px;height:150px;border:solid 1px #000;position:fixed;left:50%;top:50%;margin-left:-150px;margin-top:-200px;border:solid 1px #000;border-radius:5px;background:#fff;display:none;z-index:22}
    #lightbox{width:100%;height:100%;position:fixed;top:0;left:0;background:#000;filter:alpha(opacity=50);opacity:.5;display:none}
	table,td,th{border:0px solid black;text-align:center;}
	td{text-align:center;}
</style>

<script type="text/javascript">
  		function checkUpdate(id){
  			
  			if(window.confirm("是否修改该商品类型？")){
  				
  				window.location.href = "/JEEBigHomework/adminType/toUpdateType?id="+id;
  			}
  		}
  </script>

</head>
<body>

	<div align="center">
		<c:if test="${PageInfo.list.size() == 0 }">
		您还没有类型。
		</c:if>
		<c:if test="${PageInfo.list.size() != 0 }">
			<div style="width: 100%; text-align: center;font-weight: bold;font-size: 20px; padding: 10px;">类型列表</div>
			<table border="1" bordercolor="black" class="table table-hover" style="text-align: center; width: 80%;">
				<tr>
					<th width="200px">#</th>
					<th width="600px">类型名称</th>
					<th width="300px">修改 </th>
				</tr>
				<c:forEach items="${PageInfo.list }" var="goodsType">
					<tr>
						<td>${goodsType.id }</td>
						<td>${goodsType.typename }</td>
						<!--<a href="javascript:checkUpdate('${goodsType.id }')"> </a> -->
						<td><button type="button" class="btn btn-warning" id="type_update_btn" onclick="return PopLayer(this)">修改</button></td>
					</tr>
				</c:forEach>
			</table>
		</c:if>
	</div>
	
	<!--分页分页  -->
	<div class="row">
		<div class="col-md-6" align="center">
			当前 ${PageInfo.pageNum} 页 ，总共有${PageInfo.pages}页，总共${PageInfo.total}记录
		</div>
		<!--分页条  -->
		<div class="col-md-6">
			<nav aria-label="Page navigation">
				 <ul class="pagination">
				 
				 	<li><a href="${APP_PATH }/adminType/getType?pn=1">首页</a></li>
				 
				 <!--跳转前一页  -->
				 	<c:if test="${PageInfo.hasPreviousPage }">
				 			<li>
						      <a href="${APP_PATH }/adminType/getType?pn=${PageInfo.pageNum-1}" aria-label="Previous">
						        <span aria-hidden="true">&laquo;</span>
						      </a>
				    		</li>
					</c:if>
				 	
				<!--每一页  -->
					<c:forEach items="${PageInfo.navigatepageNums}" var="page">
				    	<c:if test="${page == PageInfo.pageNum }">
				    		<li class="active"><a href="#">${page}</a></li>
				    	</c:if>
				    	
				    	<c:if test="${page != PageInfo.pageNum }">
				    		<li><a href="${APP_PATH }/adminType/getType?pn=${page}">${page}</a></li>
				    	</c:if>
				    	
				    </c:forEach>
				    
				    <!--跳转下一页  -->
				    <c:if test="${PageInfo.hasNextPage }">
				    	<li>
					      <a href="${APP_PATH }/adminType/getType?pn=${PageInfo.pageNum+1}" aria-label="Next">
					        <span aria-hidden="true">&raquo;</span>
					      </a>
					    </li>
				    
				    </c:if>
				    
				    <li><a href="${APP_PATH }/adminType/getType?pn=${PageInfo.pages}">末页</a></li>
				  </ul>
			</nav>
		</div>
	</div>
	
	<div align="center">
		<form action="addType" method="post" class="form-inline">
			类型名称：
			<input type="text" name="typename" class="form-control" style="width:200px"/>
			<input type="submit" value="添加" class="btn btn-primary"/>
		</form>
		${msg }
	</div>
	

	<div id="lightbox"></div>
	<div id="pop">
		<form action="updateGoodsType" method="post">
		    <table width="100%" border="3" cellpadding="5" cellspacing="5">
		        <tr><td colspan="2"style="padding: 10px 0px 10px 0px; font-weight: bold; font-size: large;">修改类型</td></tr>
		        <tr><td align="right"></td><td><input type="hidden" name="name" /></td></tr>
		        <tr><td align="right">类型名称</td><td><input type="text" name="nickname" class="form-control"/></td></tr>
		        <tr><td colspan="2" align="right" style="padding: 20px 0px 20px 0px;">
		        <input type="submit" value="保存" />　
		        <input type="button" value="关闭" onclick="PopLayer()" /> </td></tr>
		    </table>
		</form>
	</div>
	<script>
	    var pop=document.getElementById('pop'),popf=pop.getElementsByTagName('form')[0],lightbox=document.getElementById('lightbox')
	    function PopLayer(obj) {
	        lightbox.style.display = pop.style.display = obj ? 'block' : 'none';
	        if (obj) {//点击修改
	            var tr = obj.parentNode.parentNode
	            popf.name.value = tr.cells[0].innerHTML
	            popf.nickname.value = tr.cells[1].innerHTML
	        }
	        return false
	    }
	</script>

</body>
</html>